import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

/* Layout */
import Layout from '@/layout'

/**
 * Note: sub-menu 仅在路由时出现 children.length >= 1
 * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
 *
 * hidden: true                   当设置 true 的时候该路由不会在侧边栏出现 如401，login等页面（默认false）
 * alwaysShow: true               当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式--如组件页面
 *                                只有一个时，会将那个子路由当做根路由显示在侧边栏--如引导页面
 *                                若你想不管路由下面的 children 声明的个数都显示你的根路由
 *                                你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，一直显示根路由
 * redirect: noRedirect           当设置 noRedirect 的时候该路由在面包屑导航中不可被点击
 * path: '/dashboard'             路由路径
 *                                路由路径的菜单如果只有一级，path的子集必需是'index'!!!
 *                                路由路径带 '/' 时代表跟路由
 * name: 'router-name'            名称由<keep-alive>使用（必须设置!!!）
 * isReopen: true                 如果设置为true，则会重新打开一个页面 (默认 false)
 * meta : {
    title: 'title'               设置该路由在侧边栏和面包屑中展示的名字（推荐集）
    icon: 'svg-name'/'el-icon-x' 设置该路由的图标，支持 svg-class，也支持 el-icon-x element-ui 的 icon
    noCache: true                如果设置为true，则不会缓存页面（默认值为false）（编辑页面不要缓存！！！）
    affix: true                  如果设置为true，则会固定在tags-view中 (默认 false)
    breadcrumb: false            如果设置为false，则不会在breadcrumb面包屑中显示(默认 true)
    activeMenu: '/example/list'  当路由设置了该属性，则会高亮相对应的侧边栏
  }
 */

/**
 * 路由固定路线，系统固定
 */
export const constantRoutes = [
  {
    path: '/redirect',
    component: Layout,
    hidden: true,
    children: [
      {
        path: '/redirect/:path(.*)',
        component: () => import('@v/redirect')
      }
    ]
  },
  {
    path: '/login',
    component: () => import('@v/login/login'),
    hidden: true
  },
  {
    path: '/404',
    component: () => import('@/views/404'),
    hidden: true
  },
  {
    path: '/',
    component: Layout,
    redirect: '/dashboard',
    children: [
      {
        path: 'dashboard',
        name: 'Dashboard',
        meta: { title: '首页', icon: 'dashboard', affix: true },
        component: () => import('@v/dashboard/dashboard')
      },
      {
        path: 'userInfo',
        name: 'UserInfo',
        meta: { title: '个人中心' },
        hidden: true,
        component: () => import('@v/dashboard/userInfo')
      }
    ]
  }
]

/**
 * 路由总路线，自定义路由页面
 */
export const asyncRoutes = [
  {
    path: '/example',
    component: Layout,
    name: 'Example',
    alwaysShow: true,
    meta: { title: '综合实例', icon: 'table' },
    children: [
      {
        path: 'table',
        name: 'Table',
        meta: { title: '综合表格', noCache: true },
        component: () => import('@v/example/table')
      },
      {
        path: 'table-add',
        name: 'TableAdd',
        meta: { title: '新增/编辑表格', activeMenu: '/example/table', noCache: true },
        hidden: true,
        component: () => import('@v/example/table/add')
      },
      {
        path: 'table-detail',
        name: 'TableDetail',
        meta: { title: '表格详情', activeMenu: '/example/table', noCache: true },
        hidden: true,
        component: () => import('@v/example/table/detail')
      },
      {
        path: 'dynamic-table',
        name: 'DynamicTable',
        meta: { title: '动态表格' },
        component: () => import('@v/example/dynamic-table')
      }
    ]
  },
  {
    path: '/nested',
    component: Layout,
    name: 'Nested',
    alwaysShow: true,
    meta: { title: '多级菜单', icon: 'list' },
    children: [
      // 注意：三级菜单，中间页面需要 router-view
      {
        path: 'menu1',
        name: 'Menu1',
        meta: { title: '二级菜单1' },
        component: () => import('@v/nested/menu1'),
        children: [
          {
            path: 'menu1-1',
            name: 'Menu1-1',
            meta: { title: '三级菜单1-1' },
            component: () => import('@v/nested/menu1/menu1-1')
          },
          {
            path: 'menu1-2',
            name: 'Menu1-2',
            meta: { title: '三级菜单1-2' },
            component: () => import('@v/nested/menu1/menu1-1/menu1-2')
          }
        ]
      },
      {
        path: 'menu2',
        name: 'Menu2',
        meta: { title: '二级菜单2' },
        component: () => import('@v/nested/menu2')
      }
    ]
  },
  {
    path: '/components',
    component: Layout,
    name: 'Components',
    alwaysShow: true,
    meta: { title: '组件', icon: 'component' },
    children: [
      {
        path: 'tinymce',
        component: () => import('@/views/components-demo/tinymce'),
        name: 'Tinymce',
        meta: { title: '富文本编辑器' }
      },
      {
        path: 'calendar',
        name: 'Calendar',
        meta: { title: '日历' },
        component: () => import('@v/components-demo/calendar')
      },
      {
        path: 'mixin',
        name: 'Mixin',
        meta: { title: '小组件' },
        component: () => import('@v/components-demo/mixin')
      }
    ]
  },
  {
    path: '/permission',
    component: Layout,
    name: 'Permission',
    alwaysShow: true,
    meta: { title: '系统管理', icon: 'tool' },
    children: [
      {
        path: 'role',
        name: 'Role',
        meta: { title: '角色管理' },
        component: () => import('@/views/permission/role')
      },
      {
        path: 'user',
        name: 'User',
        meta: { title: '用户管理' },
        component: () => import('@/views/permission/user')
      }
    ]
  },
  {
    path: '/education',
    component: Layout,
    redirect: '/education/index',
    children: [
      {
        path: 'index',
        name: 'Education',
        meta: { title: '帮助', icon: 'education' },
        component: () => import('@/views/education')
      }
    ]
  },
  {
    path: 'https://www.bilibili.com/',
    name: 'Bilibili',
    meta: { 'title': '哔哩哔哩', icon: 'guide' }
  },
  {
    path: '/data-screen',
    name: 'DataScreen',
    isReopen: true,
    component: () => import('@/views/data-screen'),
    meta: { 'title': '数据大屏', icon: 'link' }
  },
  // 404页必须放在最后 !!!
  { path: '*', redirect: '/404', hidden: true }
]

const createRouter = () => new Router({
  // mode: 'history', // 需要服务支持
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

const router = createRouter()

// 重置路由
export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher // 重置路由
}

export default router
